<template>
  <div>
    <navy>
      <div slot="main">
        <a-row type="flex" justify="space-around" align="middle">
          <a-col :span="16" id="coltitle">
            <h1>{{ articleTitle }}</h1>
          </a-col>
        </a-row>
        <a-row type="flex" justify="space-around" align="middle">
          <a-col :span="20" id="colcontent">
            <div v-html="content"></div>
          </a-col>
        </a-row>
      </div>
    </navy>
  </div>
</template>

<script>
import Navy from './nav'

export default {
  name: 'Desc',
  components: {
    Navy
  },
  data () {
    return {
      articleTitle: '',
      articleId: '',
      content: ''
    }
  },
  computed: {
    getArticleTitle: function () {
      return this.articleTitle
    },
    getcontent: function () {
      return this.content
    }
  },
  created () {
    var self = this
    this.axios.get('/api/findAllArticle').then((res) => {
      if (res.status) {
        var datajob = JSON.parse(res.data)
        var count = 0
        for (let i = 0; i < datajob.length; i++) {
          if (datajob[i].articleTag === '支部概况' && datajob[i].imgUrl === undefined) {
            count = count + 1
            if (count > 1) {
              break
            }
            this.articleTitle = datajob[i].articleTitle
            this.articleId = datajob[i].articleId
            this.axios.get('/api/getArticleContent', {
              params: {
                articleId: this.articleId
              }
            }).then((res) => {
              self.content = res.data
            })
          }
        }
      }
    })
  },
  methods: {
  }
}
</script>

<style>
#coltitle{
  height:100px;
  position:relative;
  top:50px;
  font-size:large;
  text-align:center;
  font-family:'黑体';
}
#colcontent{
  height:800px;
  position:relative;
  top:55px;
  font-size:x-large;
  text-indent:2em;
  line-height:40px;
}
img{
width: 95%;
height: 500px;
}
</style>
